<template>
  <div class="markTextPaper"> 
    <head-Menu></head-Menu>
    <div class="MTPContainer">
      <el-table :data="MTPList" style="width: calc(100% - 5px);">
        <el-table-column label="考试文件名" prop="examFileName" show-overflow-tooltip></el-table-column>
        <el-table-column label="考试名" prop="examName" show-overflow-tooltip></el-table-column>
        <el-table-column label="课目" prop="subject" show-overflow-tooltip></el-table-column>
        <el-table-column label="总批阅份数" prop="surplusNum" show-overflow-tooltip></el-table-column>
        <el-table-column label="开始批改时间" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{modifyFormat(MTPList[scope.$index].startTime)}}</span>
          </template>
        </el-table-column>
        <el-table-column width=140 >
          <template slot-scope="scope">
            <el-button @click="toMark(scope.row)" type="primary" icon='el-icon-edit' size="medium" round>开始批改</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import headMenu from '../../components/headMenu.vue'
import { getMarkTextPaperInf } from "../../api/user";
import { Toast } from "vant";
export default {
  data() {
    return {
     MTPList: [],
    }
  },
  components: {
    headMenu
  },
  props: {
    params: {
        type: Object,
        default:{}
    }
  },
  created() {
    this.getMarkTextPaperInf()
  },
  methods: {
    async getMarkTextPaperInf() {
      await getMarkTextPaperInf(this.params)
        .then((res) => {
          this.MTPList = res.MTPList
        })
    },
    toMark(row) {
      if (new Date(row.startTime) > new Date() ) {
        this.$message({
          message: '考试暂未结束，评卷通道暂未开启',
          type: 'warning'
        });
      }else{
        sessionStorage.setItem('toMarkTextPaper', JSON.stringify({ examFileName: row.examFileName, examName: row.examName, account: this.params.account }))
        this.$router.push({
          path:'/teacher/marking',
        })
      }
    },
    modifyFormat(date){
      let t_mouth = (new Date(date).getMonth() + 1) < 10 ? ('0' + (new Date(date).getMonth() + 1)) : (new Date(date).getMonth() + 1)
      let t_date = new Date(date).getDate() < 10 ? ('0' + new Date(date).getDate()) : new Date(date).getDate()
      let t_hour = new Date(date).getHours() < 10 ? ('0' + new Date(date).getHours()) : new Date(date).getHours()
      let t_min = new Date(date).getMinutes() < 10 ? ('0' + new Date(date).getMinutes()) : new Date(date).getMinutes()
      return new Date(date).getFullYear() + '-' + t_mouth + '-' + t_date + '  ' + t_hour + ":" + t_min
    },
  },
}
</script>

<style lang='stylus'>
.markTextPaper
  flex 1 1 100%
  display block
  .MTPContainer
    margin 0 10px
    border 1px solid #CCCCCC  
    text-align center
  .answerSheet
    text-align left
    margin 20px 0 0 30px
    overflow-y auto
    max-height 550px
</style>